<template>
    <div>
        <div class="margin-top">
            <el-form :model="formData" :rules="rules" ref="form" label-width="100px">                
                <el-form-item label="标题" prop="title">
                    <el-input v-model="formData.title"></el-input>
                </el-form-item>
                <el-form-item label="板块" prop="slug_name">
                    <el-input v-model="formData.slug_name"></el-input>
                </el-form-item>                                                       
                <el-form-item label="内容" prop="full_content">
                    <editor v-model="formData.full_content"/>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
export default {
    name: "MessageBoardShow",
    data() {
        return {
            permissionList:[],
            formData: {
                id:0,
                question: '',
                content: '',
                slug_name: '',
                permission:[],
                attachment:[],
                prefix:'',
                slug:'',
                issuing:'',
            },
            rules: {

            }
        }
    },
    created() {
        this.formData.id = this.$route.params.id
    },
    mounted() {
        this.getDetail();
        this.getPermission();
    },
    methods:{
        getDetail(){
            let _this = this;
            this.$http.httpPost({
                url:'/api/messageboard/show',
                datas:{id:this.formData.id},
                success(res){
                    _this.formData.id = res.id;
                    
                    _this.formData.title = res.title;
                    _this.formData.content = res.content;
                    _this.formData.full_content = res.full_content;
                    _this.formData.slug_name = res.slug.name;
                    _this.formData.prefix = res.prefix;
                    _this.formData.slug = res.slug.slug;
                    
                    if (res.issuing) {
                        _this.formData.issuing = res.issuing.name;
                    }

                    let permissionLength = res.permission.length;
                    if(permissionLength > 0){
                        for(let i=0;i < permissionLength;i++){                         
                            _this.formData.permission.push(res.permission[i].permission_id);
                        }
                    }
                                      
                }
            })
        },
        del(id) {
            let _this = this;
            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$http.httpPost({
                    url:'/api/messageboard/delete',
                    datas:{"id":id},
                    success(res){
                        _this.$utils.success('删除成功！');
                        _this.getList();
                    }
                })
            }).catch(() => {
                // _this.$utils.warning('取消了');
            });
        },       
        submitForm(formName) {
            //存在回调的方法，因为回调外和回调内的作用域不一致，所以务必为 _this 复制 this，否则在回调中无法访问this对象
            let _this = this;
            console.log(this.formData);
            //通过传递form表单ref名称，来调用表单的validate方法
            this.$refs[formName].validate((valid) => {
                //为true时验证通过
                if (valid) {
                    _this.create();
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        resetForm(formName) {
            this.$utils.message('清空');
            this.$refs[formName].resetFields();
        },
        getPermission() {
            let _this = this;
            this.$http.httpPost({
                url:'/api/permission',
                datas:{},
                success(res){
                    _this.permissionList = res.data ? res.data : [];
                }
            })
        },         
    }
}
</script>
